Difference Between let, const, and var in JavaScript

JavaScript provides three ways to declare variables: var, let, and const. Each has its unique characteristics and use cases.

1. var

• Has function scope (or global scope if declared outside a function).
• Hoisted and initialized with undefined.
• Allows re-declaration in the same scope.

Example:

        
function testVar() {
    var x = 10;
    if (true) {
        var x = 20; // re-declaration allowed
        console.log(x); // Output: 20
    }
    console.log(x); // Output: 20
}
testVar();
        
    

2. let

• Has block scope (confined to the block where it is declared).
• Hoisted but not initialized (causing a "temporal dead zone").
• Does not allow re-declaration in the same scope.

Example:

        
function testLet() {
    let x = 10;
    if (true) {
        let x = 20; // different variable due to block scope
        console.log(x); // Output: 20
    }
    console.log(x); // Output: 10
}
testLet();
        
    

3. const

• Has block scope (like let).
• Hoisted but not initialized (causing a "temporal dead zone").
• Requires a value at the time of declaration and cannot be reassigned.
• Immutable for primitive values, but objects and arrays declared with const can be modified.

Example:

        
function testConst() {
    const x = 10;
    console.log(x); // Output: 10
    // x = 20; // Error: Assignment to constant variable
    const obj = { name: "John" };
    obj.name = "Jane"; // Allowed: object properties can be modified
    console.log(obj.name); // Output: Jane
}
testConst();
        
    

Summary Table: